<template>
	<div class="shop">
	<header class="header">
		<p>我的店铺</p>
		<i class="el-icon-erp-hebingxingzhuang" @click="add"></i>
	</header>
	<div class="body">
		<div class="shoplist" v-for="(item,index) in shopList" @click="go(item)">
			<div class="box" :style="{background:'#00688B'}">
			<div class="status" v-if="item.statu === 0">审核中</div>
			<p>{{item.shopName}}</p>
		</div>
		</div>
	</div>
</div>
</template>

<script>
	export default {
		name:'shop',
		data () {
			return {
				shopList:[]
			}
		},
		created () {
			this.getShop()
		},
		mounted () {
			
		},
		methods:{
		  //获取店家拥有的所有店铺
		   getShop () {
		   	this.$http.get(this.$store.state.reqUrl + '/shops/info/myShops',{}).then(res => {
				this.shopList = res.data			
		    })
		   },
		   go (item) {
		   	 if(item.statu === 1) {
		   	 	this.$store.state.shop_id = item.id
		        this.$store.state.shop_name = item.shopName
		   	    this.$router.push('/store')
		   	 }
		   },
		   add () {
		   	  this.$router.push("/applyshop")
		   }
		}
	}
</script>

<style lang="less" scoped>
     .shop{
     	width:100%;
     	height: 100%;
     	background: #FFFFFF;
     	.header{
     		width:100%;
     		height: 100px;
     		display:flex;
     		p{
     			flex: 1;
     			padding-left: 64px;
     			font-size: 38px;
     			line-height: 100px;
     			text-align: center;    			
     		}
     		i{
     			width:100px;
     			line-height: 100px;
     			text-align: center;
     			font-size: 40px;
     			color: gray;
     			color:#00688B;
     		}
     	}
     	.body{
     		width:100%;     		
     		.shoplist{     			
     			width:90%;
     			margin:0 auto;
     			margin-bottom: 30px;
     			height:auto;
     			position: relative;
     			.box{
     			   padding:60px 20px;     			
     			p{
     				line-height: 60px;
     				text-align: center;
     				font-size: 32px;
     				color: #FFFFFF;
     			}
     			.status{
     				position: absolute;
     				width:100%;
     			    height:100%;
     			    top: 0;
     			    left: 0;
     			    text-align: center;
     			    /*line-height: 250px;*/
     			    background: rgba(0,0,0,0.6);
     			    color: #FFFFFF;
     			    font-size: 38px;
     			}
     		}
     		}
     	}
     }
</style>